<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>宝贝投-P2P平台</title>
		<!-- links begin -->
        <link rel="shortcut icon" href="favicon.ico" />
        <link rel="stylesheet" href="js/bootstrap-3.3.2-dist/css/bootstrap.css" type="text/css" />
        <link rel="stylesheet" href="css/core.css" type="text/css" />
        <script type="text/javascript" src="js/jquery/jquery-2.1.3.js"></script>
        <script type="text/javascript" src="js/bootstrap-3.3.2-dist/js/bootstrap.js"></script>
        <script type="text/javascript" src="js/jquery.bootstrap.js"></script>
        <!-- links end -->
        <link type="text/css" rel="stylesheet" href="css/account.css" />
		<script type="text/javascript" src="js/plugins/jquery.twbsPagination.min.js"></script>
		<script type="text/javascript" src="js/plugins-override.js"></script>
		<script type="text/javascript" src="js/My97DatePicker/WdatePicker.js"></script>
        <script type="text/javascript" src="js/common.js"></script>
	</head>
	<body>
        <!-- 网页顶部 begin -->
        <div class="el-header"></div>
        <!-- 网页顶部 end -->

        <!-- 网页导航 begin -->
        <div class="el-navbar navbar navbar-default"></div>
        <!-- 网页导航 end -->

		<div class="container">
			<div class="row">
                <!--左侧菜单栏 begin -->
                <div class="el-leftmenu col-sm-3"></div>
                <!--左侧菜单栏 end -->
				<hr />
				<!-- 功能页面 -->
				<div class="col-sm-9">
					<form action="http://localhost:8080/finance/bid/query" name="searchForm" id="searchForm" class="form-inline">
						<div class="form-group">
							<label>投标时间:</label>
                            <input type="text" id="beginDate" name="beginDate" class="form-control" style="cursor: pointer; background:#fff;" readonly="true" autocomplete="off" value='' />
						</div>
						<div class="form-group">
                            <label>&emsp;至&emsp;</label>
                            <input type="text" id="endDate" name="endDate" class="form-control" style="cursor: pointer; background:#fff;" readonly="true" autocomplete="off" value='' />
						</div>
						<div class="form-group">
                            <label>&emsp;状态:</label>
						    <select class="form-control" id="borrowStates" name="borrowStates">
								<option value="1,20,30,31,40,50">全部</option>
								<option value="20">招标中</option>
								<option value="30">放款审核中</option>
								<option value="31">放款审核拒绝</option>
								<option value="40">还款中</option>
								<option value="50">已完成</option>
						    </select>
						</div>
						<div class="form-group">
                            &emsp;&emsp;
                            <button type="button" id="query" class="btn btn-success">
                                <i class="icon-search"></i>
                                查询
                            </button>
                        </div>
					</form>
					<div class="panel panel-default" style="margin-top: 20px;">
						<div class="panel-heading">
							<span class="pull-left" style="line-height: 35px;">投标明细</span>
							<a class="pull-right btn btn-danger btn-sm" href="invest.html">
								我要投标
							</a>
							<div class="clearfix"></div>
						</div>
						<table id="tblBid" class="table table-striped">
							<thead>
								<tr>
									<th>标题</th>
									<th>投标金额</th>
									<th>年化率</th>
									<th>投标时间</th>
									<th>状态</th>
								</tr>
							</thead>
							<tbody></tbody>
						</table>
                        <div id="divPagination" style="text-align: center;">
                            <ul id="pagination" class="pagination"></ul>
                        </div>
					</div>
				</div>
			</div>
		</div>

        <!-- 页脚 begin -->
        <div class="container-foot-2"></div>
        <!-- 页脚 end -->
	</body>

<script type="text/javascript">

    // 判断用户是否已经登录
    let jsonUser = sessionStorage.getItem("user");
    if(!jsonUser) window.location.href = 'index.html';

    // 如果用户已经登录，则解析出user对象
    let user = JSON.parse(jsonUser);

    // 查询条件对象
    let queryObject = new Object();
    queryObject.userId = user.id;

    $(function(){

        // 加载公共顶部模板
        $('.el-header').load('tpl-head.html');

        // 加载网站导航栏模板
        $('.el-navbar').load('tpl-navbar.html');

        // 加载左侧菜单栏模板
        $('.el-leftmenu').load('tpl-leftmenu.html');

        // 加载页脚模板
        $('.container-foot-2').load('tpl-footer.html');


        // 时间日期组件
        $("#beginDate").click(function(){
            WdatePicker();
        });

        $("#endDate").click(function(){
            WdatePicker();
        });

        // 初始化查询时间

        // 开始时间(最近30天)
        let beginDate = new Date();
        beginDate.setDate(beginDate.getDate() - 30);

        // 结束时间(今天)
        let endDate = new Date();

        $("#beginDate").val(beginDate.Format('yyyy-MM-dd'));
        $("#endDate").val(endDate.Format('yyyy-MM-dd'));


        // 注册查询按钮事件
        $("#query").click(function(){

            // 获取查询数据
            let beginDate = $("#beginDate").val();
            let endDate = $("#endDate").val();
            let borrowStates = $("#borrowStates").val();

            // 封装查询请求数据
            queryObject.beginDate = beginDate + ' 00:00:00';
            queryObject.endDate = endDate + ' 23:59:59';
            queryObject.borrowStates = borrowStates;
            queryObject.currentPage  = 1;

            // 加载'投标列表'
            loadingBid();

        });// $("#query").click(function());


        // 加载'投标列表'
        loadingBid();

    });// $(function());

/** 加载'投标列表'数据 **/
function loadingBid(){

    // 加载'借款记录'数据
    $.post('http://localhost:8080/finance/bid/query', queryObject, function (result) {

        // 如果返回的数据的响应码不是'成功(200)'
        if(result.code != 200) {
            $.messager.alert(result.msg);
            return;
        }

        // 如果返回的数据响应码为200
        // 就进行表格数据填充
        let pageResult = result.data;

        // 填充表格数据
        fillBidTable( pageResult );

        // 初始化分页插件
        $("#pagination").remove();
        $("#divPagination").append('<ul id="pagination" class="pagination"></ul>');

        $("#pagination").twbsPagination({
            totalPages: result.pages.totalPageCount,
            visiblePages: 10,
            startPage: result.pages.currentPageNo,
            first: '首页',
            last: '最后一页',
            prev: '上一页',
            next: '下一页',
            onPageClick:function( event, page ){
                // 加载指定页码数据
                queryObject.currentPage = page;
                loadingBid();

            }// onPageClick();

        });// $("#pagination").twbsPagination();

    });// $.post();


}// loadingBid();

/** 填充表格数据 **/
function fillBidTable( listData ) {

    // 清空表格数据
    $('#tblBid tbody').empty();

    // 如果没有集合数据，就直接返回
    if( !listData || listData.length == 0 ){
        // 设置没有数据提示
        $('#tblBid tbody').html('<tr><td colspan="5" align="center"><p class="text-danger">暂时没有投标信息</p></td></tr>');
        return;
    }// if();

	// 循环构造单元格数据，并进行填充
	for( let i = 0; i < listData.length; i++ ) {

		let bid = listData[i];

		let tdTitle = '<td><a target="_blank" href="borrow-info.html?id=' + bid.borrowId + '">' + bid.borrowTitle + '</a>&nbsp;<span class="label label-primary">信</span></td>';

		// 投标金额
		let bidAmount = bid.bidAmount / MONEY_UNIT;
		let tdBidAmount = '<td>' + bidAmount + '元</td>';

		// 年化利率
		let tdYearRate = '<td>' + bid.yearRate + '%</td>';

		// 投标时间
		let tdBidTime = '<td>' + bid.bidTime + '</td>';

		// 借款审核状态
		let state = BORROW_STATE[bid.borrowState];
		let tdState = '<td>' + state + '</td>';

		// 将构造好的单元格数据，填充到表格中
		$('#tblBid tbody').append('<tr>' + tdTitle + tdBidAmount + tdYearRate + tdBidTime + tdState + '</tr>');

	}// for();

}// fillBidTable( listData );
</script>
</html>